<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>折线图</title>
    <!--引入echarts.js这个文件-->
    <script src="../js/echarts.js"></script>
</head>
<body>
    <!--定义画布-->
    <div id="main" style="height: 400px;width: 600px"></div>
    <script type="text/javascript">
        // 进行echarts的初始化，以及定位到画布
        var mychart = echarts.init(document.getElementById("main"));
        // 配置项和配置数据
        var option = {
            // 配置折线图的配置项
            title:{
                text:'折线图',
                subtext:'这里是副标题'
            },
            // 在图形上显示数据
            tooltip:{},
            legend:{
                data:['衬衫','袜子','裤子']
            },
            xAxis:{
                data:['星期一','星期二','星期三','星期四','星期五','星期六','星期日']
            },
            yAxis:{},
            series:[
                {
                    name:'衬衫',
                    type:'bar',
                    data:[5,20,36,10,10,20,100]
                },
                {
                    name:'袜子',
                    type:'bar',
                    data:[15,10,16,100,20,120,6]
                },
                {
                    name:'裤子',
                    type:'line',
                    data:[55,10,56,20,100,20,200]
                }
            ]
        };
        mychart.setOption(option)
    </script>

</body>
</html>